import { motion } from "motion/react";
import { useEffect, useState } from "react";

export const Cursor = () => {
  const [isVisible, setIsVisible] = useState(true);

  useEffect(() => {
    const cursorInterval = setInterval(() => {
      setIsVisible((prev) => !prev);
    }, 400); // 光标闪烁间隔时间

    return () => clearInterval(cursorInterval);
  }, []);

  return (
    <motion.span
        className={`ml-1 ${isVisible ? "visible" : "invisible"}`}
        initial={{ opacity: 1 }}
        animate={{ opacity: isVisible ? 1 : 0 }}
        transition={{ duration: 0.2 }}
      >|</motion.span>
  );
}